/* 专门写blog博客的样式 */
.blog{
	width: 100%;
	/* 高度不设置 就取决于里面的内容高度的综合 */
	padding: 20px;
}

.blog .title{
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	padding: 10px 0;
}
.blog .data{
	text-align: center;
	color: burlywood;
	padding: 10px 0;
}
.blog .desc{
	/* em也是前端中的一个常用单位是和当前字体大小直接相关的.
	假设当前字体是14px 1em == 14px, 2em == 28px */
	text-indent: 2em;
}


/* 这样不好设计字体的边框.blog .btn{
	text-align: center;
	padding: 5px 0;
} */
.blog a{
	/* 先设置成块级元素 方便设置尺寸的边框 */
	display: block;
	width: 120px;
	height: 30px;
	/* 块级元素 可以用浏览器居中 然后上下 外边距分别设置为20px */
	margin: 20px auto;
	border: 2px black solid;
	
	
	/* 字体 水平 垂直居中 */
	text-align: center;
	line-height: 30px;
	
	
	/* 颜色 去下划线 */
	color: black;
	text-decoration: none;
	
	/* 如果想让鼠标在标签上的变化变的柔和一些 可以加上过渡效果 */
	transition: all 0.5s;
}
/* 鼠标在标签上会显示背景色 */
.blog a:hover{
	background-color:rgba(255, 240, 255, 0.4);
	/* color: black; */
}


/* 博客详情页 */
.content p{
	width: 100%;
	padding: 10px;
	text-indent: 2em;
}


